import React, { Component } from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
import { Form, DatePicker, Row, Col, Button, Select, InputNumber } from 'antd';
const Option = Select.Option;

const { RangePicker } = DatePicker;


const formItemLayout = {
    labelCol: {span: 6},
    wrapperCol: {span: 18},
};
class SearchList extends Component{
    constructor(props) {
        super(props);
        this.state = {};
    }

    submit = (e) => {
        e.preventDefault();
        const { form: { getFieldsValue }, handleSearch } = this.props;
        handleSearch(getFieldsValue());
    }

    renderPerson = () => {
        const { personData } = this.props;
        const ele = personData ? personData.map(item => <Option value={item.value} key={item.value} >{item.name}</Option>) : null
        return ele;
    }

    render() {
        const { form: { getFieldDecorator  }, initTime  } = this.props;
        return (
            <div>
                <Form onSubmit={this.submit}>
                    <Row gutter={24}>
                        <Col lg={12} xl={7}>
                            <Form.Item {...formItemLayout} label={"分配时间"}>
                                {
                                    getFieldDecorator('time', {
                                        initialValue: initTime
                                    })(
                                        <DatePicker placeholder='请选择' />
                                    )
                                }
                            </Form.Item>
                        </Col>
                        <Col lg={12} xl={7}>
                            <Form.Item {...formItemLayout} label={"催收天数"}>
                                {
                                    getFieldDecorator('day', {
                                        initialValue: 3
                                    })(
                                        <InputNumber style={{width:'100%'}} min={0}/>
                                    )
                                }
                            </Form.Item>
                        </Col>
                        <Col lg={12} xl={7}>
                            <Form.Item {...formItemLayout} label={"催收组"}>
                                {
                                    getFieldDecorator('departmentId', {
                                        initialValue: ''
                                    })(
                                        <Select>
                                            {this.renderPerson()}
                                        </Select>
                                    )
                                }
                            </Form.Item>
                        </Col>
                        <Col xl={2} style={{textAlign:'right'}}>
                            <Form.Item>
                                <Button type={'primary'} htmlType={'submit'} disabled={this.props.btnDisable}>查询</Button>
                            </Form.Item>
                        </Col>
                    </Row>
                </Form>
            </div>

        );
    }

}
SearchList.propTypes = {
    sourceData: PropTypes.array,
    handleSearch: PropTypes.func,
    initTime: PropTypes.object,
};
SearchList.defaultProps = {
    sourceData: [],
    handleSearch: () => {},
    initTime: []
};

export default Form.create()(SearchList);